/*
 * @Author       : 魏威 <1209562577@qq.com>
 * @Date         : 2021-08-20 15:53 周5
 * @Description  : 项目列表， 列表组件
 */
import { Table } from 'antd';
import dayjs from 'dayjs';
import React from 'react';
import { User } from './search-panel';

interface Project {
  id: string;
  name: string;
  personId: string;
  pin: boolean;
  organization: string;
}

interface ListProps {
  list: Project[];
  users: User[];
}

export default function List({ list, users }: ListProps) {
  return (
    <Table
      pagination={false}
      columns={[
        {
          title: '名称',
          dataIndex: 'name',
          sorter: (a, b) => a.name.localeCompare(b.name)
        },
        {
          title: '部门',
          dataIndex: 'organization',
          sorter: (a, b) => a.name.localeCompare(b.name)
        },
        {
          title: '负责人',
          dataIndex: 'id',
          render: (personId) => {
            return (
              <span>
                {users.find((user) => user.id === personId)?.name || '未知'}
              </span>
            );
          }
        },
        {
          title: '创建时间',
          dataIndex: 'created',
          render: (created) => {
            return (
              <span>
                {created ? dayjs(created).format('YYYY-MM-DD') : '无'}
              </span>
            );
          }
        }
      ]}
      dataSource={list}
    />
  );
}
